import { Layout, Breadcrumb, Input, Select, Form} from 'antd';
import RoleTab from './RoleTab';
import User1 from '../User/User1';
import Add from './Add/Add';
import Date from '../../../components/Date'
import './role.less'

const { Content } = Layout;

function Role() {
    return (
        <Layout style={{ padding: '0 24px' }} className="Rolecon">
            {/* 面包屑 */}
            <Breadcrumb style={{ margin: '16px 0' }}>
                <Breadcrumb.Item>系统管理</Breadcrumb.Item>
                <Breadcrumb.Item>角色管理</Breadcrumb.Item>
            </Breadcrumb>
            {/* 内容上方输入框 */}
            <Form size="default" layout="inline" className="Roleform">
                <Form.Item label="时间">
                    <Date />
                </Form.Item>
                <Form.Item label="用户名">
                    <Input placeholder="请输入用户名" />
                </Form.Item>
                <Form.Item label="状态" className='select'>
                    <Select placeholder="请选择">
                        <Select.Option value="启用">启用</Select.Option>
                        <Select.Option value="禁用">禁用</Select.Option>
                    </Select>
                </Form.Item>
                <Add/>
            </Form>
            {/* 内容 */}
            <Content>
                {/* 表格 */}
                <RoleTab/>
                
            </Content>
        </Layout>
    )
}
export default Role;